使用 Fireworks

使用 JavaScript 创建可编辑元件参数:

如果将元件另存为丰富元件,则默认情况下 PNG 文件保存在 <user settings>\Application Data\Adobe\Fireworks 9\ Common Library\Custom Symbols 文件夹 (Windows) 或 <user name>/Application Support/Adobe/Fireworks9/ Common Library/Custom Symbols (Macintosh) 中。

若要创建丰富元件,必须创建 JavaScript 文件,使用 .JSF 扩展名将其保存在与该元件相同的位置,并使用与该元件相同的名称。例如,mybutton.graphic.png 应包含名称为 mybutton.jsf 的 JavaScript 文件。

使用“创建元件脚本”面板,非编程人员可以分配某些简单的元件属性以及自动创建 JavaScript 文件。若要打开此面板,请从“命令”菜单中选择“创建元件脚本”。

JavaScript 文件

若要向元件中添加可编辑参数,必须定义 JavaScript 文件中的两个函数:

• 函数 setDefaultValues() ― 定义可以编辑的参数以及这些参数的默认值。

• 函数 applyCurrentValues() ― 将通过“元件属性”面板输入的值应用于图形元件。

以下是用于创建自定义元件的示例 .JSF 文件:

function setDefaultValues()
{
var currValues = new Array();
//构建元件属性
currValues.push({name:"Selected", value:"true", type:"Boolean"});
Widget.elem.customData["currentValues"] = currValues;
}

function applyCurrentValues()
{
var currValues = Widget.elem.customData["currentValues"];
// 获取元件对象名称
var Check = Widget.GetObjectByName("Check");
Check.visible = currValues[0].value;
}
switch (Widget.opCode)
{
case 1: setDefaultValues(); break;
case 2: applyCurrentValues(); break;
default: break;
}

本示例 JavaScript 说明了可以更改颜色的丰富元件:

function setDefaultValues()
{
var currValues = new Array();
//Name 是将显示在“元件属性”面板中的参数名称
//Value 是首次加载丰富元件时显示的默认值。在本例中,蓝色将是使用丰富元件时的默认颜色。
//Color 是显示的参数类型。Color 将在“元件属性”面板中调用颜色弹出框。
currValues.push({name:"BG Color", value:"#003366", type:"Color"});
Widget.elem.customData["currentValues"] = currValues;

}

function applyCurrentValues()
{
var currValues = Widget.elem.customData["currentValues"];
//color_bg 是 PNG 中将更改颜色的层名称
var color_bg = Widget.GetObjectByName("color_bg");
color_bg.pathAttributes.fillColor = currValues[0].value;
}

switch (Widget.opCode)
{
case 1: setDefaultValues(); break;
case 2: applyCurrentValues(); break;
default: break;
}

若要更好地了解如何使用 .JSF 文件来自定义元件属性,请浏览软件中包括的示例组件。